<template>
 <view class="pb26">
    <u-row customStyle="margin-bottom: 20px;flex-wrap: wrap;" v-show="goods.length">
      <u-col span="6" v-for="good in goods" :key="good.id">
        <good-card :good="good"></good-card>
      </u-col>
    </u-row>
    <u-loadmore :status="status" />
 </view>
</template>

<script>
import { goodsList } from '@/config/api'
export default {
  data() {
   return {
     keyword: '',
     page: 1,
     goods: [],
     status: 'loadmore'
   }
  },
  onLoad(option) {
    this.keyword = option.keyword
    this.getData()
  },
  methods: {
    async getData() {
      const params = {
        page: this.page,
        title: this.keyword
      }
      this.status = 'loading';
      const res = await goodsList({params})
      this.goods = this.goods.concat(res.goods.data)
    }
  },
  onReachBottom() {
    if(this.goods.length) {
      // 重新请求数据，带上分页参数
      this.page = this.page + 1
      this.getData()
    }
  }
}
</script>

<style scoped lang="scss">
</style>